import {Image, View} from '@tarojs/components'
import React, { useEffect, useState } from 'react';
import './join-tt-group.scss'

interface Info {
  platformSet: any
}

const JoinTtGroup: React.FC<Info> = (props: any) => {
  const [platformSet, setPlatformSet] = useState(false);
  const [showJoinGroup, setShowJoinGroup] = useState(false);

  useEffect(() => {
    if (props.platformSet) {
      setPlatformSet(props.platformSet)
    }
  }, [props.platformSet])

  const joinGroup = () => {
    tt.setClipboardData({
      data: ''
    })
    setShowJoinGroup(true)
  }

  return (
    <View className='join-tt-group'>
      <View className='tt-group-box'>
        <View className='tt-group-left'>
          <Image className='tt-group-image' src='https://resource.ivcheng.com/upload/images/1be6d3fb-bad3-403a-ad37-d1922fd42c91.jpg' mode='aspectFill' />
          <View className='group-left-content'>
            <View className='left-content-title'>海量福利分享</View>
            <View className='left-content-desc'>快来进群获取更多福利信息吧~</View>
          </View>
        </View>
        <View className='tt-group-right'>
          <View className='group-right--button' onClick={joinGroup}>
            点我加入
          </View>
        </View>
      </View>
      {showJoinGroup && <View className='tt-group-tip-window-box'>
        <View className='tt-group-overlay' onClick={()=> {setShowJoinGroup(false)}} />
        <View className='tt-group-tip-box'>
          <View className='tt-group-tip-content'>口令已复制，退出此页面，重新进入抖音即可识别群口令</View>
          <View className='tt-group-i-know' onClick={()=> {setShowJoinGroup(false)}}>知道了</View>
        </View>
      </View>}
    </View>
  )
}
export default JoinTtGroup
